<div *ngIf="!result.show" class="identity-box">
  <h3 class="text-center" style="font-size: 20px; margin-bottom: 20px;">{{title}}</h3>
  <form nz-form (ngSubmit)="submitForm()" role="form" #form="ngForm">
    <nz-form-item>
      <nz-form-control>
        <nz-input-group nzSize="large" nzPrefixIcon="anticon anticon-mail">
          <input nz-input type="email" [(ngModel)]="dto.Email" name="email" placeholder="电子邮箱" required email [remoteInverse]="'api/identity/CheckEmailExists?email=:value'"
            #email="ngModel">
        </nz-input-group>
        <nz-form-explain *ngIf="(email.dirty || email.touched) && email.errors?.required">请输入电子邮箱</nz-form-explain>
        <nz-form-explain *ngIf="(email.dirty || email.touched) && email.errors?.email">电子邮箱格式不正确，应形如xxx@xxx.xxx</nz-form-explain>
        <nz-form-explain *ngIf="(email.dirty || email.touched) && email.errors?.remoteInverse">电子邮箱不存在，请更换重试</nz-form-explain>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-control>
        <nz-input-group nzSize="large" [nzSuffix]="suffixButton">
          <input [(ngModel)]="code.code" name="verifyCode" type="text" nz-input placeholder="验证码" required minlength="4" [remoteInverse]="'api/common/CheckVerifyCode?code=:value&verifycodeid='+code.id"
            #verifyCode="ngModel">
        </nz-input-group>
        <ng-template #suffixButton>
          <div style="text-align:right; cursor: pointer;">
            <img (click)="refreshVerifyCode()" src="{{code.image}}" />
          </div>
        </ng-template>
        <nz-form-explain *ngIf="(verifyCode.dirty || verifyCode.touched) && (verifyCode.errors?.required || verifyCode.errors?.minlength)">请输入验证码</nz-form-explain>
        <nz-form-explain *ngIf="(verifyCode.dirty || verifyCode.touched) && verifyCode.errors?.remoteInverse">验证码不正确，请刷新重试</nz-form-explain>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-row>
        <nz-col nzOffset="16">
          <button nz-button nzSize="large" nzType="primary" type="submit" [disabled]="!(form.form.valid && canSubmit && canSend)">下一步</button>
          <a style="line-height: 45px;margin-left: 10px;" href="javascript:history.back()">返回</a>
        </nz-col>
      </nz-row>
    </nz-form-item>
  </form>
</div>
<result *ngIf="result.show" type="{{result.type}}" [title]="result.title" description="{{result.description}}">
  <button nz-button [nzType]="'primary'" (click)="result.show=false;dto.VerifyCode=null;">返回</button>
  <button *ngIf="result.type=='success'" nz-button (click)="osharp.openMailSite(dto.Email)">进入邮箱</button>
  <button nz-button (click)="router.navigate(['home'])">返回首页</button>
</result>